<!doctype html>
<html class="no-js" lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>product sidebar</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- Favicon -->
    <link rel="shortcut icon" type="image/x-icon" href="assets/img/favicon.ico">
    
    <!-- CSS 
    ========================= -->
    <!--bootstrap min css-->
    <link rel="stylesheet" href="assets/css/bootstrap.min.css">
    <!--owl carousel min css-->
    <link rel="stylesheet" href="assets/css/owl.carousel.min.css">
    <!--slick min css-->
    <link rel="stylesheet" href="assets/css/slick.css">
    <!--magnific popup min css-->
    <link rel="stylesheet" href="assets/css/magnific-popup.css">
    <!--font awesome css-->
    <link rel="stylesheet" href="assets/css/font.awesome.css">
    <!--ionicons css-->
    <link rel="stylesheet" href="assets/css/ionicons.min.css">
    <!--7 stroke icons css-->
    <link rel="stylesheet" href="assets/css/pe-icon-7-stroke.css">
    <!--animate css-->
    <link rel="stylesheet" href="assets/css/animate.css">
    <!--jquery ui min css-->
    <link rel="stylesheet" href="assets/css/jquery-ui.min.css">
    <!--plugins css-->
    <link rel="stylesheet" href="assets/css/plugins.css">
    <!-- Main Style CSS -->
    <link rel="stylesheet" href="assets/css/style.css">
    
    <!--modernizr min js here-->
    <script src="assets/js/vendor/modernizr-3.7.1.min.js"></script>

</head>

<body>

    <!--header area start-->
    
    <!--offcanvas menu area start-->
    <div class="off_canvars_overlay">
                
    </div>
    <div class="offcanvas_menu">
        <div class="container">
            <div class="row">
                <div class="col-12">
                   
                    <div class="offcanvas_menu_wrapper">
                        <div class="canvas_close">
                            <a href="javascript:void(0)"><i class="ion-android-close"></i></a>  
                        </div>
                        <div class="header_search_box">
                            <form action="#">
                                <input placeholder="Search" type="text">
                                <button type="submit"><i class="fa fa-search" aria-hidden="true"></i></button>

                            </form>
                        </div>
                        <div id="menu" class="text-left ">
                            <ul class="offcanvas_main_menu">
                                <li class="menu-item-has-children active">
                                    <a href="#">Home</a>
                                    <ul class="sub-menu">
                                        <li><a href="index.html">Home 1</a></li>
                                        <li><a href="index-2.html">Home 2</a></li>
                                        <li><a href="index-3.html">Home 3</a></li>
                                        <li><a href="index-4.html">Home 4</a></li>
                                        <li><a href="index-5.html">Home 5</a></li>
                                        <li><a href="index-6.html">Home 6</a></li>
                                    </ul>
                                </li>
                                <li class="menu-item-has-children">
                                    <a href="#">Shop</a>
                                    <ul class="sub-menu">
                                        <li class="menu-item-has-children">
                                            <a href="#">Shop Layouts</a>
                                            <ul class="sub-menu">
                                                <li><a href="shop.html">shop</a></li>
                                                <li><a href="shop-fullwidth.html">Full Width</a></li>
                                                <li><a href="shop-fullwidth-list.html">Full Width list</a></li>
                                                <li><a href="shop-right-sidebar.html">Right Sidebar </a></li>
                                                <li><a href="shop-right-sidebar-list.html"> Right Sidebar list</a></li>
                                                <li><a href="shop-list.html">List View</a></li>
                                            </ul>
                                        </li>
                                        <li class="menu-item-has-children">
                                            <a href="#">other Pages</a>
                                            <ul class="sub-menu">
                                                <li><a href="cart.html">cart</a></li>
                                                <li><a href="wishlist.html">Wishlist</a></li>
                                                <li><a href="checkout.html">Checkout</a></li>
                                                <li><a href="my-account.html">my account</a></li>
                                                <li><a href="404.html">Error 404</a></li>
                                            </ul>
                                        </li>
                                        <li class="menu-item-has-children">
                                            <a href="#">Product Types</a>
                                            <ul class="sub-menu">
                                                <li><a href="product-details.html">product details</a></li>
                                                <li><a href="product-sidebar.html">product sidebar</a></li>
                                                <li><a href="product-grouped.html">product grouped</a></li>
                                                <li><a href="variable-product.html">product variable</a></li>
                                            </ul>
                                        </li>
                                    </ul>
                                </li>
                                <li class="menu-item-has-children">
                                    <a href="#">blog</a>
                                    <ul class="sub-menu">
                                        <li><a href="blog.html">blog</a></li>
                                        <li><a href="blog-details.html">blog details</a></li>
                                        <li><a href="blog-fullwidth.html">blog fullwidth</a></li>
                                        <li><a href="blog-sidebar.html">blog sidebar</a></li>
                                    </ul>

                                </li>
                                <li class="menu-item-has-children">
                                    <a href="#">pages </a>
                                    <ul class="sub-menu">
                                        <li><a href="about.html">About Us</a></li>
                                        <li><a href="services.html">services</a></li>
                                        <li><a href="faq.html">Frequently Questions</a></li>
                                        <li><a href="contact.html">contact</a></li>
                                        <li><a href="login.html">login</a></li>
                                        <li><a href="404.html">Error 404</a></li>
                                    </ul>
                                </li>
                                <li class="menu-item-has-children">
                                    <a href="my-account.html">my account</a>
                                </li>
                                <li class="menu-item-has-children">
                                    <a href="about.html">about Us</a>
                                </li>
                                <li class="menu-item-has-children">
                                    <a href="contact.html"> Contact Us</a> 
                                </li>
                            </ul>
                        </div>
                        <div class="offcanvas_footer">
                            <span><a href="#"><i class="fa fa-envelope-o"></i> info@yourdomain.com</a></span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--offcanvas menu area end-->
    
    <header>
        <div class="main_header">
            <div class="header_top">
                <div class="container">
                    <div class="row align-items-center">
                        <div class="col-lg-6 col-md-12">
                            <div class="header_contact_us">
                                <ul>
                                    <li><span><i class="fa fa-phone"></i> Call us now: </span> <a href="tel:(+800)123456789"><i class="icon-call-in"></i> (+800)123456789</a></li>
                                    <li><span><i class="fa fa-envelope-o"></i>Email: </span> <a href="mailto:#"><i class="icon-envelope"></i> has@posthemes.com</a></li>
                                </ul>
                            </div>
                        </div>
                        <div class="col-lg-6 col-md-12">
                            <div class="header_account_area">
                                <ul>
                                    <li><a href="wishlist.html">My Wishlist</a></li>
                                    <li><a href="checkout.html">check out</a></li>
                                    <li><a href="login.html">Sign in</a></li>
                                    <li class="language_currency "><a href="#">en <i class="fa fa-angle-down"></i></a>
                                        <ul class="dropdown_language">
                                            <li><a href="#">French</a></li>
                                            <li><a href="#">Spanish</a></li>
                                            <li><a href="#">Russian</a></li>
                                        </ul>
                                    </li>
                                    <li class="language_currency "><a href="#">$ <i class="fa fa-angle-down"></i></a>
                                        <ul class="dropdown_currency">
                                            <li><a href="#">€ Euro</a></li>
                                            <li><a href="#">£ Pound Sterling</a></li>
                                            <li><a href="#">$ US Dollar</a></li>
                                        </ul>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="header_middle">
                <div class="container">
                    <div class="row align-items-center">
                       <div class="col-lg-4 col-md-4 col-3 col_canvas">
                            <div class="canvas_open">
                                <a href="javascript:void(0)"><i class="ion-navicon-round"></i></a>
                            </div>
                       </div>
                        <div class="col-lg-4 col-md-4 col-sm-4 col-5">
                            <div class="logo">
                                <a href="index.html"><img src="assets/img/logo/logo.png" alt=""></a>
                            </div>
                        </div>
                        <div class="col-lg-4 col_search">
                            <div class="header_search_box">
                                <form action="#">
                                    <input placeholder="Search" type="text">
                                    <button type="submit"><i class="fa fa-search" aria-hidden="true"></i></button>

                                </form>
                            </div>
                        </div>
                        <div class="col-lg-4 col-md-4 col-sm-5 col-4">
                            <div class="cart_wishlist_area">
                                <div class="header_wishlist">
                                    <a href="wishlist.html"><i class="fa fa-heart-o" aria-hidden="true"></i>
                                        <span class="item_count">3</span>
                                    </a>
                                </div>
                                <div class="mini_cart_wrapper">
                                    <a href="javascript:void(0)"><i class="fa fa-shopping-cart" aria-hidden="true"></i>
                                        <span class="cartitems"> Cart Items</span>
                                        <span class="item_count">2</span>
                                    </a>
                               </div>
                           </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="header_bottom sticky-header">
                <div class="container">
                    <div class="row">
                        <div class="col-lg-10">
                            <!--main menu start-->
                            <div class="main_menu menu_position"> 
                                <nav>  
                                    <ul>
                                        <li><a  href="index.html">home<i class="fa fa-angle-down"></i></a>
                                            <ul class="sub_menu">
                                                <li><a href="index.html">Home shop 1</a></li>
                                                <li><a href="index-2.html">Home shop 2</a></li>
                                                <li><a href="index-3.html">Home shop 3</a></li>
                                                <li><a href="index-4.html">Home shop 4</a></li>
                                                <li><a href="index-5.html">Home shop 5</a></li>
                                                <li><a href="index-6.html">Home shop 6</a></li>
                                            </ul>
                                        </li>
                                        <li class="mega_items"><a class="active" href="shop.html">shop<i class="fa fa-angle-down"></i></a> 
                                            <div class="mega_menu">
                                                <ul class="mega_menu_inner">
                                                    <li><a href="#">Shop Layouts</a>
                                                        <ul>
                                                            <li><a href="shop-fullwidth.html">Full Width</a></li>
                                                            <li><a href="shop-fullwidth-list.html">Full Width list</a></li>
                                                            <li><a href="shop-right-sidebar.html">Right Sidebar </a></li>
                                                            <li><a href="shop-right-sidebar-list.html"> Right Sidebar list</a></li>
                                                            <li><a href="shop-list.html">List View</a></li>
                                                        </ul>
                                                    </li>
                                                    <li><a href="#">other Pages</a>
                                                        <ul>
                                                            <li><a href="cart.html">cart</a></li>
                                                            <li><a href="wishlist.html">Wishlist</a></li>
                                                            <li><a href="checkout.html">Checkout</a></li>
                                                            <li><a href="my-account.html">my account</a></li>
                                                            <li><a href="404.html">Error 404</a></li>
                                                        </ul>
                                                    </li>
                                                    <li><a href="#">Product Types</a>
                                                        <ul>
                                                            <li><a href="product-details.html">product details</a></li>
                                                            <li><a href="product-sidebar.html">product sidebar</a></li>
                                                            <li><a href="product-grouped.html">product grouped</a></li>
                                                            <li><a href="variable-product.html">product variable</a></li>

                                                        </ul>
                                                    </li>
                                                    <li><a href="#">Clothing</a>
                                                        <ul>
                                                            <li><a href="shop.html">T-Shirts</a></li>
                                                            <li><a href="shop.html">Coats</a></li>
                                                            <li><a href="shop.html">Jackets</a></li>
                                                            <li><a href="shop.html">Jeans</a></li>
                                                        </ul>
                                                    </li>
                                                </ul>
                                                <div class="mega_menu_banner">
                                                    <div class="banner_menu_thumb">
                                                        <a href="#"><img src="assets/img/bg/banner_menu.jpg" alt=""></a>
                                                    </div>
                                                    <div class="banner_menu_thumb">
                                                        <a href="#"><img src="assets/img/bg/banner_menu2.jpg" alt=""></a>
                                                    </div>
                                                    <div class="banner_menu_thumb">
                                                        <a href="#"><img src="assets/img/bg/banner_menu3.jpg" alt=""></a>
                                                    </div>
                                                    <div class="banner_menu_thumb">
                                                        <a href="#"><img src="assets/img/bg/banner_menu4.jpg" alt=""></a>
                                                    </div>
                                                </div>
                                            </div>
                                        </li>
                                        <li><a href="blog.html">blog<i class="fa fa-angle-down"></i></a>
                                            <ul class="sub_menu pages">
                                                <li><a href="blog-details.html">blog details</a></li>
                                                <li><a href="blog-fullwidth.html">blog fullwidth</a></li>
                                                <li><a href="blog-sidebar.html">blog sidebar</a></li>
                                            </ul>
                                        </li> 
                                        <li><a href="contact.html"> Contact Us</a></li>
                                        <li><a href="about.html"> About us</a></li>
                                        <li><a href="#">pages <i class="fa fa-angle-down"></i></a>
                                            <ul class="sub_menu pages">
                                                <li><a href="about.html">About Us</a></li>
                                                <li><a href="services.html">services</a></li>
                                                <li><a href="faq.html">Frequently Questions</a></li>
                                                <li><a href="contact.html">contact</a></li>
                                                <li><a href="login.html">login</a></li>
                                                <li><a href="404.html">Error 404</a></li>
                                            </ul>
                                        </li>
                                    </ul>  
                                </nav> 
                            </div>
                            <!--main menu end-->
                        </div>
                    </div>
                </div>
            </div>
        </div> 
        <!--mini cart-->
        <div class="mini_cart">
            <div class="cart_gallery">
                <div class="cart_close">
                    <div class="cart_text">
                        <h3>cart</h3>
                    </div>
                    <div class="mini_cart_close">
                        <a href="javascript:void(0)"><i class="ion-android-close"></i></a>
                    </div>
                </div>
                <div class="cart_item">
                   <div class="cart_img">
                       <a href="#"><img src="assets/img/s-product/product.jpg" alt=""></a>
                   </div>
                    <div class="cart_info">
                        <a href="#">Juicy Couture Tricot</a>
                        <p>1 x <span> $30.00 </span></p>    
                    </div>
                    <div class="cart_remove">
                        <a href="#"><i class="ion-ios-close-outline"></i></a>
                    </div>
                </div>
                <div class="cart_item">
                   <div class="cart_img">
                       <a href="#"><img src="assets/img/s-product/product2.jpg" alt=""></a>
                   </div>
                    <div class="cart_info">
                        <a href="#">Juicy Couture Juicy</a>
                        <p>1 x <span> $29.00 </span></p>    
                    </div>
                    <div class="cart_remove">
                        <a href="#"><i class="ion-ios-close-outline"></i></a>
                    </div>
                </div>
            </div>
            <div class="mini_cart_table">
                <div class="cart_table_border">
                    <div class="cart_total">
                        <span>Sub total:</span>
                        <span class="price">$125.00</span>
                    </div>
                    <div class="cart_total mt-10">
                        <span>total:</span>
                        <span class="price">$125.00</span>
                    </div>
                </div>
            </div>
            <div class="mini_cart_footer">
               <div class="cart_button">
                    <a href="cart.html"><i class="fa fa-shopping-cart"></i> View cart</a>
                </div>
                <div class="cart_button">
                    <a class="active" href="checkout.html"><i class="fa fa-sign-in"></i> Checkout</a>
                </div>

            </div>
        </div>
        <!--mini cart end-->
    </header>
    <!--header area end-->
    
    <div class="section_bg">
        <div class="container">   
            <!--breadcrumbs area start-->
            <div class="breadcrumbs_area">  
                <div class="row">
                    <div class="col-12">
                        <div class="breadcrumb_content">
                            <ul>
                                <li><a href="index.html">home</a></li>
                                <li>product sidebar</li>
                            </ul>
                        </div>
                    </div>
                </div>         
            </div>
            <!--breadcrumbs area end-->

            <!--product details start-->
            <div class="product_details product_sidebar">
                <div class="row">
                    <div class="col-lg-3 col-md-12">
                        <!--sidebar widget start-->
                        <aside class="sidebar_widget">
                            <div class="widget_inner">
                                <div class="widget_list widget_categories">
                                    <h3>Women</h3>
                                    <ul>
                                        <li class="widget_sub_categories sub_categories1"><a href="javascript:void(0)">Shoes</a>
                                            <ul class="widget_dropdown_categories dropdown_categories1">
                                                <li><a href="#">Document</a></li>
                                                <li><a href="#">Dropcap</a></li>
                                                <li><a href="#">Dummy Image</a></li>
                                                <li><a href="#">Dummy Text</a></li>
                                                <li><a href="#">Fancy Text</a></li>
                                            </ul>
                                        </li>
                                        <li class="widget_sub_categories sub_categories2"><a href="javascript:void(0)">Bags</a>
                                            <ul class="widget_dropdown_categories dropdown_categories2">
                                                <li><a href="#">Flickr</a></li>
                                                <li><a href="#">Flip Box</a></li>
                                                <li><a href="#">Cocktail</a></li>
                                                <li><a href="#">Frame</a></li>
                                                <li><a href="#">Flickrq</a></li>
                                            </ul>
                                        </li>
                                        <li class="widget_sub_categories sub_categories3"><a href="javascript:void(0)">Clothing</a>
                                            <ul class="widget_dropdown_categories dropdown_categories3">
                                                <li><a href="#">Platform Beds</a></li>
                                                <li><a href="#">Storage Beds</a></li>
                                                <li><a href="#">Regular Beds</a></li>
                                                <li><a href="#">Sleigh Beds</a></li>
                                                <li><a href="#">Laundry</a></li>
                                            </ul>
                                        </li>
                                    </ul>
                                </div>
                                <div class="widget_list widget_filter">
                                    <h3>Filter by price</h3>
                                    <form action="#"> 
                                        <div id="slider-range"></div>   
                                        <button type="submit">Filter</button>
                                        <input type="text" name="text" id="amount" />   
                                    </form> 
                                </div>
                                <div class="widget_list widget_color">
                                    <h3>Select By Color</h3>
                                    <ul>
                                        <li>
                                            <a href="#">Black  <span>(6)</span></a> 
                                        </li>
                                        <li>
                                            <a href="#">White  <span>(4)</span></a> 
                                        </li>
                                        <li>
                                            <a href="#"> Blue <span>(8)</span></a> 
                                        </li>
                                        <li>
                                            <a href="#"> Green <span>(6)</span></a> 
                                        </li>

                                    </ul>
                                </div>
                                <div class="widget_list widget_color">
                                    <h3>Select By SIze</h3>
                                    <ul>
                                        <li>
                                            <a href="#">S  <span>(6)</span></a> 
                                        </li>
                                        <li>
                                            <a href="#"> M <span>(8)</span></a> 
                                        </li>
                                        <li>
                                            <a href="#">L <span>(10)</span></a> 
                                        </li>
                                        <li>
                                            <a href="#"> XL <span>(6)</span></a> 
                                        </li>

                                    </ul>
                                </div>
                                 <div class="widget_list widget_brand">
                                    <h3>Brand</h3>
                                    <ul>
                                        <li>
                                            <a href="#">Studio Design <span>(8)</span></a> 
                                        </li>
                                        <li>
                                            <a href="#"> Graphic Corner<span>(5)</span></a> 
                                        </li>
                                    </ul>
                                </div>
                                <div class="widget_list widget_manu">
                                    <h3>Manufacturer</h3>
                                    <ul>
                                        <li>
                                            <a href="#">Cotton <span>(6)</span></a> 
                                        </li>
                                        <li>
                                            <a href="#">Elastane <span>(10)</span></a> 
                                        </li>
                                        <li>
                                            <a href="#">Polyester <span>(4)</span></a> 
                                        </li>
                                        <li>
                                            <a href="#">Wool <span>(10)</span></a> 
                                        </li>
                                        <li>
                                            <a href="#">Squarred <span>(3)</span></a> 
                                        </li>

                                    </ul>
                                </div>
                                <div class="widget_list tags_widget">
                                    <h3>Product tags</h3>
                                    <div class="tag_cloud">
                                        <a href="#">Men</a>
                                        <a href="#">Women</a>
                                        <a href="#">Watches</a>
                                        <a href="#">Bags</a>
                                        <a href="#">Dress</a>
                                    </div>
                                </div>
                            </div>
                        </aside>
                        <!--sidebar widget end-->
                    </div>
                    <div class="col-lg-9 col-md-12">
                        <div class="product_right_sidebar">
                            <div class="row">
                                <div class="col-lg-5 col-md-5">
                                    <div class="product-details-tab">
                                        <div id="img-1" class="zoomWrapper single-zoom">
                                            <a href="#">
                                                <img id="zoom1" src="assets/img/product/productbig4.jpg" data-zoom-image="assets/img/product/productbig1.jpg" alt="big-1">
                                            </a>
                                        </div>
                                        <div class="single-zoom-thumb">
                                            <ul class="s-tab-zoom owl-carousel single-product-active" id="gallery_01">
                                                <li>
                                                    <a href="#" class="elevatezoom-gallery active" data-update="" data-image="assets/img/product/productbig4.jpg" data-zoom-image="assets/img/product/productbig4.jpg">
                                                        <img src="assets/img/product/productbig4.jpg" alt="zo-th-1"/>
                                                    </a>

                                                </li>
                                                <li >
                                                    <a href="#" class="elevatezoom-gallery active" data-update="" data-image="assets/img/product/productbig1.jpg" data-zoom-image="assets/img/product/productbig1.jpg">
                                                        <img src="assets/img/product/productbig1.jpg" alt="zo-th-1"/>
                                                    </a>

                                                </li>
                                                <li >
                                                    <a href="#" class="elevatezoom-gallery active" data-update="" data-image="assets/img/product/productbig2.jpg" data-zoom-image="assets/img/product/productbig2.jpg">
                                                        <img src="assets/img/product/productbig2.jpg" alt="zo-th-1"/>
                                                    </a>

                                                </li>
                                                <li >
                                                    <a href="#" class="elevatezoom-gallery active" data-update="" data-image="assets/img/product/productbig3.jpg" data-zoom-image="assets/img/product/productbig3.jpg">
                                                        <img src="assets/img/product/productbig3.jpg" alt="zo-th-1"/>
                                                    </a>

                                                </li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-lg-7 col-md-7">
                                    <div class="product_d_right">
                                       <form action="#">
                                            <div class="productd_title_nav">
                                                <h1><a href="#">Lorem ipsum dolor sit amet elit</a></h1>
                                                <div class="product_nav">
                                                    <ul>
                                                        <li class="prev"><a href="product-details.html"><i class="fa fa-angle-left"></i></a></li>
                                                        <li class="next"><a href="variable-product.html"><i class="fa fa-angle-right"></i></a></li>
                                                    </ul>
                                                </div>
                                            </div>

                                            <div class=" product_ratting">
                                                <ul>
                                                    <li><a href="#"><i class="ion-android-star"></i></a></li>
                                                    <li><a href="#"><i class="ion-android-star"></i></a></li>
                                                    <li><a href="#"><i class="ion-android-star"></i></a></li>
                                                    <li><a href="#"><i class="ion-android-star"></i></a></li>
                                                    <li><a href="#"><i class="ion-android-star"></i></a></li>
                                                    <li class="review"><a href="#"> (customer review ) </a></li>
                                                </ul>

                                            </div>
                                            <div class="price_box"> 
                                                <span class="old_price">$67.00</span>
                                                <span class="current_price">$57.00</span>
                                            </div>
                                            <div class="product_desc">
                                                <p>eget velit. Donec ac tempus ante. Fusce ultricies massa massa. Fusce aliquam, purus eget sagittis vulputate, sapien libero hendrerit est, sed commodo augue nisi non neque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed tempor, lorem et placerat vestibulum, metus nisi posuere nisl, in </p>
                                            </div>
                                            <div class="product_variant color">
                                                <h3>Available Options</h3>
                                                <label>color</label>
                                                <ul>
                                                    <li class="color1"><a href="#"></a></li>
                                                    <li class="color2"><a href="#"></a></li>
                                                    <li class="color3"><a href="#"></a></li>
                                                    <li class="color4"><a href="#"></a></li>
                                                </ul>
                                            </div>
                                            <div class="product_variant quantity">
                                                <label>quantity</label>
                                                <input min="1" max="100" value="1" type="number">
                                                <button class="button" type="submit">add to cart</button>  

                                            </div>
                                            <div class=" product_d_action">
                                               <ul>
                                                   <li><a href="#" title="Add to wishlist">+ Add to Wishlist</a></li>
                                                   <li><a href="#" title="Add to wishlist">+ Compare</a></li>
                                               </ul>
                                            </div>
                                            <div class="product_meta">
                                                <span>Category: <a href="#">Clothing</a></span>
                                            </div>

                                        </form>
                                        <div class="priduct_social">
                                            <ul>
                                                <li><a class="facebook" href="#" title="facebook"><i class="fa fa-facebook"></i> Like</a></li>           
                                                <li><a class="twitter" href="#" title="twitter"><i class="fa fa-twitter"></i> tweet</a></li>           
                                                <li><a class="pinterest" href="#" title="pinterest"><i class="fa fa-pinterest"></i> save</a></li>           
                                                <li><a class="google-plus" href="#" title="google +"><i class="fa fa-google-plus"></i> share</a></li>        
                                                <li><a class="linkedin" href="#" title="linkedin"><i class="fa fa-linkedin"></i> linked</a></li>        
                                            </ul>      
                                        </div>

                                    </div>
                                </div>
                            </div>
                        </div>
                        <!--product info start-->
                        <div class="product_d_info mb-60">  
                            <div class="product_d_inner ">   
                                <div class="product_info_button">    
                                    <ul class="nav" role="tablist">
                                        <li >
                                            <a class="active" data-toggle="tab" href="#info" role="tab" aria-controls="info" aria-selected="false">Description</a>
                                        </li>
                                        <li>
                                             <a data-toggle="tab" href="#sheet" role="tab" aria-controls="sheet" aria-selected="false">Specification</a>
                                        </li>
                                        <li>
                                           <a data-toggle="tab" href="#reviews" role="tab" aria-controls="reviews" aria-selected="false">Reviews (1)</a>
                                        </li>
                                    </ul>
                                </div>
                                <div class="tab-content">
                                    <div class="tab-pane fade show active" id="info" role="tabpanel" >
                                        <div class="product_info_content">
                                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam fringilla augue nec est tristique auctor. Donec non est at libero vulputate rutrum. Morbi ornare lectus quis justo gravida semper. Nulla tellus mi, vulputate adipiscing cursus eu, suscipit id nulla.</p>
                                            <p>Pellentesque aliquet, sem eget laoreet ultrices, ipsum metus feugiat sem, quis fermentum turpis eros eget velit. Donec ac tempus ante. Fusce ultricies massa massa. Fusce aliquam, purus eget sagittis vulputate, sapien libero hendrerit est, sed commodo augue nisi non neque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed tempor, lorem et placerat vestibulum, metus nisi posuere nisl, in accumsan elit odio quis mi. Cras neque metus, consequat et blandit et, luctus a nunc. Etiam gravida vehicula tellus, in imperdiet ligula euismod eget.</p>
                                        </div>    
                                    </div>
                                    <div class="tab-pane fade" id="sheet" role="tabpanel" >
                                        <div class="product_d_table">
                                           <form action="#">
                                                <table>
                                                    <tbody>
                                                        <tr>
                                                            <td class="first_child">Compositions</td>
                                                            <td>Polyester</td>
                                                        </tr>
                                                        <tr>
                                                            <td class="first_child">Styles</td>
                                                            <td>Girly</td>
                                                        </tr>
                                                        <tr>
                                                            <td class="first_child">Properties</td>
                                                            <td>Short Dress</td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                            </form>
                                        </div>
                                        <div class="product_info_content">
                                            <p>Fashion has been creating well-designed collections since 2010. The brand offers feminine designs delivering stylish separates and statement dresses which have since evolved into a full ready-to-wear collection in which every item is a vital part of a woman's wardrobe. The result? Cool, easy, chic looks with youthful elegance and unmistakable signature style. All the beautiful pieces are made in Italy and manufactured with the greatest attention. Now Fashion extends to a range of accessories including shoes, hats, belts and more!</p>
                                        </div>    
                                    </div>

                                    <div class="tab-pane fade" id="reviews" role="tabpanel" >
                                        <div class="reviews_wrapper">
                                            <h2>1 review for Donec eu furniture</h2>
                                            <div class="reviews_comment_box">
                                                <div class="comment_thmb">
                                                    <img src="assets/img/blog/comment2.jpg" alt="">
                                                </div>
                                                <div class="comment_text">
                                                    <div class="reviews_meta">
                                                        <div class="star_rating">
                                                            <ul>
                                                                <li><a href="#"><i class="ion-android-star"></i></a></li>
                                                                <li><a href="#"><i class="ion-android-star"></i></a></li>
                                                                <li><a href="#"><i class="ion-android-star"></i></a></li>
                                                                <li><a href="#"><i class="ion-android-star"></i></a></li>
                                                                <li><a href="#"><i class="ion-android-star"></i></a></li>
                                                            </ul>   
                                                        </div>
                                                        <p><strong>admin </strong>- September 12, 2018</p>
                                                        <span>roadthemes</span>
                                                    </div>
                                                </div>

                                            </div>
                                            <div class="comment_title">
                                                <h2>Add a review </h2>
                                                <p>Your email address will not be published.  Required fields are marked </p>
                                            </div>
                                            <div class="product_ratting mb-10">
                                               <h3>Your rating</h3>
                                                <ul>
                                                    <li><a href="#"><i class="ion-android-star"></i></a></li>
                                                    <li><a href="#"><i class="ion-android-star"></i></a></li>
                                                    <li><a href="#"><i class="ion-android-star"></i></a></li>
                                                    <li><a href="#"><i class="ion-android-star"></i></a></li>
                                                    <li><a href="#"><i class="ion-android-star"></i></a></li>
                                                </ul>
                                            </div>
                                            <div class="product_review_form">
                                                <form action="#">
                                                    <div class="row">
                                                        <div class="col-12">
                                                            <label for="review_comment">Your review </label>
                                                            <textarea name="comment" id="review_comment" ></textarea>
                                                        </div> 
                                                        <div class="col-lg-6 col-md-6">
                                                            <label for="author">Name</label>
                                                            <input id="author"  type="text">

                                                        </div> 
                                                        <div class="col-lg-6 col-md-6">
                                                            <label for="email">Email </label>
                                                            <input id="email"  type="text">
                                                        </div>  
                                                    </div>
                                                    <button type="submit">Submit</button>
                                                 </form>   
                                            </div> 
                                        </div>     
                                    </div>
                                </div>
                            </div>       
                        </div>  
                        <!--product info end-->

                        <!--product area start-->
                        <section class="product_area related_products">
                            <div class="section_title psec_title">
                                <h2>Related Products</h2>
                            </div>
                            <div class="row">
                                <div class="product_carousel product_column4 owl-carousel">
                                   <div class="col-lg-3">
                                        <article class="single_product">
                                            <figure>
                                                <div class="product_thumb">
                                                    <a class="primary_img" href="product-details.html"><img src="assets/img/product/product1.jpg" alt=""></a>
                                                    <div class="label_product">
                                                        <span class="label_sale">Sale</span>
                                                    </div>
                                                    <div class="action_links">
                                                        <ul>
                                                            <li class="quick_button"><a href="#" data-toggle="modal" data-target="#modal_box"  title="quick view"> <i class="fa fa-eye" aria-hidden="true"></i></a></li>
                                                            <li class="wishlist"><a href="wishlist.html" title="Add to Wishlist"><i class="fa fa-heart-o" aria-hidden="true"></i></a></li>                                              
                                                        </ul>
                                                    </div>
                                                </div>
                                                <figcaption class="product_content">
                                                    <h4 class="product_name"><a href="product-details.html">Proin Lectus Ipsum</a></h4>
                                                    <div class="product_rating">
                                                        <ul>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                        </ul>
                                                    </div>
                                                    <div class="price_box"> 
                                                        <span class="old_price">$86.00</span>
                                                        <span class="current_price">$82.00</span>
                                                    </div>
                                                    <div class="add_to_cart">
                                                        <a href="cart.html" title="Add to cart"><i class="fa fa-shopping-cart" aria-hidden="true"></i> Add to cart</a>
                                                    </div>
                                                </figcaption>
                                            </figure>
                                        </article>
                                   </div>
                                   <div class="col-lg-3">
                                        <article class="single_product">
                                            <figure>
                                                <div class="product_thumb">
                                                    <a class="primary_img" href="product-details.html"><img src="assets/img/product/product2.jpg" alt=""></a>
                                                    <div class="action_links">
                                                        <ul>
                                                            <li class="quick_button"><a href="#" data-toggle="modal" data-target="#modal_box"  title="quick view"> <i class="fa fa-eye" aria-hidden="true"></i></a></li>
                                                            <li class="wishlist"><a href="wishlist.html" title="Add to Wishlist"><i class="fa fa-heart-o" aria-hidden="true"></i></a></li>                                              
                                                        </ul>
                                                    </div>
                                                </div>
                                                <figcaption class="product_content">
                                                    <h4 class="product_name"><a href="product-details.html">Occaecati Cupiditate</a></h4>
                                                    <div class="product_rating">
                                                        <ul>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                        </ul>
                                                    </div>
                                                    <div class="price_box"> 
                                                        <span class="old_price">$78.00</span>
                                                        <span class="current_price">$72.00</span>
                                                    </div>
                                                    <div class="add_to_cart">
                                                        <a href="cart.html" title="Add to cart"><i class="fa fa-shopping-cart" aria-hidden="true"></i> Add to cart</a>
                                                    </div>
                                                </figcaption>
                                            </figure>
                                        </article>
                                   </div>
                                   <div class="col-lg-3">
                                        <article class="single_product">
                                            <figure>
                                                <div class="product_thumb">
                                                    <a class="primary_img" href="product-details.html"><img src="assets/img/product/product3.jpg" alt=""></a>
                                                    <div class="label_product">
                                                        <span class="label_sale">Sale</span>
                                                    </div>
                                                    <div class="action_links">
                                                        <ul>
                                                            <li class="quick_button"><a href="#" data-toggle="modal" data-target="#modal_box"  title="quick view"> <i class="fa fa-eye" aria-hidden="true"></i></a></li>
                                                            <li class="wishlist"><a href="wishlist.html" title="Add to Wishlist"><i class="fa fa-heart-o" aria-hidden="true"></i></a></li>                                              
                                                        </ul>
                                                    </div>
                                                </div>
                                                <figcaption class="product_content">
                                                    <h4 class="product_name"><a href="product-details.html">Consequences are</a></h4>
                                                    <div class="product_rating">
                                                        <ul>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                        </ul>
                                                    </div>
                                                    <div class="price_box"> 
                                                        <span class="old_price">$92.00</span>
                                                        <span class="current_price">$88.00</span>
                                                    </div>
                                                    <div class="add_to_cart">
                                                        <a href="cart.html" title="Add to cart"><i class="fa fa-shopping-cart" aria-hidden="true"></i> Add to cart</a>
                                                    </div>
                                                </figcaption>
                                            </figure>
                                        </article>
                                   </div>
                                   <div class="col-lg-3">
                                        <article class="single_product">
                                            <figure>
                                                <div class="product_thumb">
                                                    <a class="primary_img" href="product-details.html"><img src="assets/img/product/product4.jpg" alt=""></a>
                                                    <div class="action_links">
                                                        <ul>
                                                            <li class="quick_button"><a href="#" data-toggle="modal" data-target="#modal_box"  title="quick view"> <i class="fa fa-eye" aria-hidden="true"></i></a></li>
                                                            <li class="wishlist"><a href="wishlist.html" title="Add to Wishlist"><i class="fa fa-heart-o" aria-hidden="true"></i></a></li>                                              
                                                        </ul>
                                                    </div>
                                                </div>
                                                <figcaption class="product_content">
                                                    <h4 class="product_name"><a href="product-details.html">Voluptas Nulla</a></h4>
                                                    <div class="product_rating">
                                                        <ul>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                        </ul>
                                                    </div>
                                                    <div class="price_box"> 
                                                        <span class="old_price">$68.00</span>
                                                        <span class="current_price">$62.00</span>
                                                    </div>
                                                    <div class="add_to_cart">
                                                        <a href="cart.html" title="Add to cart"><i class="fa fa-shopping-cart" aria-hidden="true"></i> Add to cart</a>
                                                    </div>
                                                </figcaption>
                                            </figure>
                                        </article>
                                   </div>
                                   <div class="col-lg-3">
                                        <article class="single_product">
                                            <figure>
                                                <div class="product_thumb">
                                                    <a class="primary_img" href="product-details.html"><img src="assets/img/product/product5.jpg" alt=""></a>
                                                    <div class="label_product">
                                                        <span class="label_sale">Sale</span>
                                                    </div>
                                                    <div class="action_links">
                                                        <ul>
                                                            <li class="quick_button"><a href="#" data-toggle="modal" data-target="#modal_box"  title="quick view"> <i class="fa fa-eye" aria-hidden="true"></i></a></li>
                                                            <li class="wishlist"><a href="wishlist.html" title="Add to Wishlist"><i class="fa fa-heart-o" aria-hidden="true"></i></a></li>                                              
                                                        </ul>
                                                    </div>
                                                </div>
                                                <figcaption class="product_content">
                                                    <h4 class="product_name"><a href="product-details.html">Primis In Faucibus</a></h4>
                                                    <div class="product_rating">
                                                        <ul>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                        </ul>
                                                    </div>
                                                    <div class="price_box"> 
                                                        <span class="old_price">$73.00</span>
                                                        <span class="current_price">$67.00</span>
                                                    </div>
                                                    <div class="add_to_cart">
                                                        <a href="cart.html" title="Add to cart"><i class="fa fa-shopping-cart" aria-hidden="true"></i> Add to cart</a>
                                                    </div>
                                                </figcaption>
                                            </figure>
                                        </article>
                                   </div>
                                   <div class="col-lg-3">
                                        <article class="single_product">
                                            <figure>
                                                <div class="product_thumb">
                                                    <a class="primary_img" href="product-details.html"><img src="assets/img/product/product6.jpg" alt=""></a>
                                                    <div class="action_links">
                                                        <ul>
                                                            <li class="quick_button"><a href="#" data-toggle="modal" data-target="#modal_box"  title="quick view"> <i class="fa fa-eye" aria-hidden="true"></i></a></li>
                                                            <li class="wishlist"><a href="wishlist.html" title="Add to Wishlist"><i class="fa fa-heart-o" aria-hidden="true"></i></a></li>                                              
                                                        </ul>
                                                    </div>
                                                </div>
                                                <figcaption class="product_content">
                                                    <h4 class="product_name"><a href="product-details.html">Fusce Aliquam</a></h4>
                                                    <div class="product_rating">
                                                        <ul>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                        </ul>
                                                    </div>
                                                    <div class="price_box"> 
                                                        <span class="old_price">$88.00</span>
                                                        <span class="current_price">$78.00</span>
                                                    </div>
                                                    <div class="add_to_cart">
                                                        <a href="cart.html" title="Add to cart"><i class="fa fa-shopping-cart" aria-hidden="true"></i> Add to cart</a>
                                                    </div>
                                                </figcaption>
                                            </figure>
                                        </article>
                                   </div>
                               </div>
                            </div>  
                        </section>
                        <!--product area end-->

                        <!--product area start-->
                        <section class="product_area upsell_products">
                            <div class="section_title psec_title">
                                <h2>Upsell Products	</h2>
                            </div>
                            <div class="row">
                                <div class="product_carousel product_column4 owl-carousel">
                                    <div class="col-lg-3">
                                        <article class="single_product">
                                            <figure>
                                                <div class="product_thumb">
                                                    <a class="primary_img" href="product-details.html"><img src="assets/img/product/product5.jpg" alt=""></a>
                                                    <div class="label_product">
                                                        <span class="label_sale">Sale</span>
                                                    </div>
                                                    <div class="action_links">
                                                        <ul>
                                                            <li class="quick_button"><a href="#" data-toggle="modal" data-target="#modal_box"  title="quick view"> <i class="fa fa-eye" aria-hidden="true"></i></a></li>
                                                            <li class="wishlist"><a href="wishlist.html" title="Add to Wishlist"><i class="fa fa-heart-o" aria-hidden="true"></i></a></li>                                              
                                                        </ul>
                                                    </div>
                                                </div>
                                                <figcaption class="product_content">
                                                    <h4 class="product_name"><a href="product-details.html">Primis In Faucibus</a></h4>
                                                    <div class="product_rating">
                                                        <ul>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                        </ul>
                                                    </div>
                                                    <div class="price_box"> 
                                                        <span class="old_price">$73.00</span>
                                                        <span class="current_price">$67.00</span>
                                                    </div>
                                                    <div class="add_to_cart">
                                                        <a href="cart.html" title="Add to cart"><i class="fa fa-shopping-cart" aria-hidden="true"></i> Add to cart</a>
                                                    </div>
                                                </figcaption>
                                            </figure>
                                        </article>
                                   </div>
                                   <div class="col-lg-3">
                                        <article class="single_product">
                                            <figure>
                                                <div class="product_thumb">
                                                    <a class="primary_img" href="product-details.html"><img src="assets/img/product/product6.jpg" alt=""></a>
                                                    <div class="action_links">
                                                        <ul>
                                                            <li class="quick_button"><a href="#" data-toggle="modal" data-target="#modal_box"  title="quick view"> <i class="fa fa-eye" aria-hidden="true"></i></a></li>
                                                            <li class="wishlist"><a href="wishlist.html" title="Add to Wishlist"><i class="fa fa-heart-o" aria-hidden="true"></i></a></li>                                              
                                                        </ul>
                                                    </div>
                                                </div>
                                                <figcaption class="product_content">
                                                    <h4 class="product_name"><a href="product-details.html">Fusce Aliquam</a></h4>
                                                    <div class="product_rating">
                                                        <ul>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                        </ul>
                                                    </div>
                                                    <div class="price_box"> 
                                                        <span class="old_price">$88.00</span>
                                                        <span class="current_price">$78.00</span>
                                                    </div>
                                                    <div class="add_to_cart">
                                                        <a href="cart.html" title="Add to cart"><i class="fa fa-shopping-cart" aria-hidden="true"></i> Add to cart</a>
                                                    </div>
                                                </figcaption>
                                            </figure>
                                        </article>
                                   </div>
                                    <div class="col-lg-3">
                                        <article class="single_product">
                                            <figure>
                                                <div class="product_thumb">
                                                    <a class="primary_img" href="product-details.html"><img src="assets/img/product/product1.jpg" alt=""></a>
                                                    <div class="label_product">
                                                        <span class="label_sale">Sale</span>
                                                    </div>
                                                    <div class="action_links">
                                                        <ul>
                                                            <li class="quick_button"><a href="#" data-toggle="modal" data-target="#modal_box"  title="quick view"> <i class="fa fa-eye" aria-hidden="true"></i></a></li>
                                                            <li class="wishlist"><a href="wishlist.html" title="Add to Wishlist"><i class="fa fa-heart-o" aria-hidden="true"></i></a></li>                                              
                                                        </ul>
                                                    </div>
                                                </div>
                                                <figcaption class="product_content">
                                                    <h4 class="product_name"><a href="product-details.html">Proin Lectus Ipsum</a></h4>
                                                    <div class="product_rating">
                                                        <ul>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                        </ul>
                                                    </div>
                                                    <div class="price_box"> 
                                                        <span class="old_price">$86.00</span>
                                                        <span class="current_price">$82.00</span>
                                                    </div>
                                                    <div class="add_to_cart">
                                                        <a href="cart.html" title="Add to cart"><i class="fa fa-shopping-cart" aria-hidden="true"></i> Add to cart</a>
                                                    </div>
                                                </figcaption>
                                            </figure>
                                        </article>
                                   </div>
                                   <div class="col-lg-3">
                                        <article class="single_product">
                                            <figure>
                                                <div class="product_thumb">
                                                    <a class="primary_img" href="product-details.html"><img src="assets/img/product/product2.jpg" alt=""></a>
                                                    <div class="action_links">
                                                        <ul>
                                                            <li class="quick_button"><a href="#" data-toggle="modal" data-target="#modal_box"  title="quick view"> <i class="fa fa-eye" aria-hidden="true"></i></a></li>
                                                            <li class="wishlist"><a href="wishlist.html" title="Add to Wishlist"><i class="fa fa-heart-o" aria-hidden="true"></i></a></li>                                              
                                                        </ul>
                                                    </div>
                                                </div>
                                                <figcaption class="product_content">
                                                    <h4 class="product_name"><a href="product-details.html">Occaecati Cupiditate</a></h4>
                                                    <div class="product_rating">
                                                        <ul>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                        </ul>
                                                    </div>
                                                    <div class="price_box"> 
                                                        <span class="old_price">$78.00</span>
                                                        <span class="current_price">$72.00</span>
                                                    </div>
                                                    <div class="add_to_cart">
                                                        <a href="cart.html" title="Add to cart"><i class="fa fa-shopping-cart" aria-hidden="true"></i> Add to cart</a>
                                                    </div>
                                                </figcaption>
                                            </figure>
                                        </article>
                                   </div>
                                   <div class="col-lg-3">
                                        <article class="single_product">
                                            <figure>
                                                <div class="product_thumb">
                                                    <a class="primary_img" href="product-details.html"><img src="assets/img/product/product3.jpg" alt=""></a>
                                                    <div class="label_product">
                                                        <span class="label_sale">Sale</span>
                                                    </div>
                                                    <div class="action_links">
                                                        <ul>
                                                            <li class="quick_button"><a href="#" data-toggle="modal" data-target="#modal_box"  title="quick view"> <i class="fa fa-eye" aria-hidden="true"></i></a></li>
                                                            <li class="wishlist"><a href="wishlist.html" title="Add to Wishlist"><i class="fa fa-heart-o" aria-hidden="true"></i></a></li>                                              
                                                        </ul>
                                                    </div>
                                                </div>
                                                <figcaption class="product_content">
                                                    <h4 class="product_name"><a href="product-details.html">Consequences are</a></h4>
                                                    <div class="product_rating">
                                                        <ul>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                        </ul>
                                                    </div>
                                                    <div class="price_box"> 
                                                        <span class="old_price">$92.00</span>
                                                        <span class="current_price">$88.00</span>
                                                    </div>
                                                    <div class="add_to_cart">
                                                        <a href="cart.html" title="Add to cart"><i class="fa fa-shopping-cart" aria-hidden="true"></i> Add to cart</a>
                                                    </div>
                                                </figcaption>
                                            </figure>
                                        </article>
                                   </div>
                                   <div class="col-lg-3">
                                        <article class="single_product">
                                            <figure>
                                                <div class="product_thumb">
                                                    <a class="primary_img" href="product-details.html"><img src="assets/img/product/product4.jpg" alt=""></a>
                                                    <div class="action_links">
                                                        <ul>
                                                            <li class="quick_button"><a href="#" data-toggle="modal" data-target="#modal_box"  title="quick view"> <i class="fa fa-eye" aria-hidden="true"></i></a></li>
                                                            <li class="wishlist"><a href="wishlist.html" title="Add to Wishlist"><i class="fa fa-heart-o" aria-hidden="true"></i></a></li>                                              
                                                        </ul>
                                                    </div>
                                                </div>
                                                <figcaption class="product_content">
                                                    <h4 class="product_name"><a href="product-details.html">Voluptas Nulla</a></h4>
                                                    <div class="product_rating">
                                                        <ul>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                            <li><a href="#"><i class="fa fa-star" aria-hidden="true"></i></a></li>
                                                        </ul>
                                                    </div>
                                                    <div class="price_box"> 
                                                        <span class="old_price">$68.00</span>
                                                        <span class="current_price">$62.00</span>
                                                    </div>
                                                    <div class="add_to_cart">
                                                        <a href="cart.html" title="Add to cart"><i class="fa fa-shopping-cart" aria-hidden="true"></i> Add to cart</a>
                                                    </div>
                                                </figcaption>
                                            </figure>
                                        </article>
                                   </div>

                               </div>
                            </div>   
                        </section>
                        <!--product area end-->
                    </div>
                </div>   
            </div>
            <!--product details end-->
            
            <!--brand area start-->
            <div class="brand_area">
               <div class="row">
                    <div class="col-12">
                        <div class="section_title">
                            <h2>Brand</h2>
                        </div>   
                    </div>
                </div>
                <div class="row">
                    <div class="col-12">
                        <div class="brand_container owl-carousel ">
                            <div class="single_brand">
                                <a href="#"><img src="assets/img/brand/brand1.jpg" alt=""></a>
                            </div>
                            <div class="single_brand">
                                <a href="#"><img src="assets/img/brand/brand2.jpg" alt=""></a>
                            </div>
                            <div class="single_brand">
                                <a href="#"><img src="assets/img/brand/brand3.jpg" alt=""></a>
                            </div>
                            <div class="single_brand">
                                <a href="#"><img src="assets/img/brand/brand4.jpg" alt=""></a>
                            </div>
                            <div class="single_brand">
                                <a href="#"><img src="assets/img/brand/brand1.jpg" alt=""></a>
                            </div>
                            <div class="single_brand">
                                <a href="#"><img src="assets/img/brand/brand2.jpg" alt=""></a>
                            </div>
                            <div class="single_brand">
                                <a href="#"><img src="assets/img/brand/brand3.jpg" alt=""></a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!--brand area end-->
        </div>    
    </div>
    
    
   <!--footer area start-->
    <footer class="footer_widgets"> 
        <div class="footer_top">
            <div class="container">
                <div class="row">
                    <div class="col-lg-3 col-md-4 col-sm-6">
                        <div class="footer_list">
                            <div class="footer_list_title">
                                <h3>about us</h3>
                            </div>
                            <div class="footer_logo">
                                <a href="index.html"><img src="assets/img/logo/logo.png" alt=""></a>
                            </div>
                            <div class="footer_desc">
                                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elitse do eiusmod tempor incididunt ut labore et dolore.</p>
                            </div>
                        </div>
                    </div>   
                        
                    <div class="col-lg-3 col-md-4 col-sm-6">
                        <div class="footer_list">
                            <div class="footer_list_title">
                                <h3>THEME FEATURES</h3>
                            </div>
                            <div class="footer_list_menu">
                                <ul>
                                    <li><a href="#">theme features</a></li>
                                    <li><a href="#">Our Other Projects</a></li>
                                    <li><a href="#">Typography</a></li>
                                    <li><a href="#">One Click To Join Us</a></li>
                                    <li><a href="#">Follow Us On Twitter</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>  
                    <div class="col-lg-3 col-md-4 col-sm-6">
                        <div class="footer_list">
                            <div class="footer_list_title">
                                <h3>KEY FEATURES</h3>
                            </div>
                            <div class="footer_contact">
                               <div class="footer_contact_list">
                                   <div class="footer_contact_icon">
                                       <span>1</span>
                                   </div>
                                   <div class="footer_contact_text">
                                       <p>Choose your wishlist products then add to cart.</p>
                                   </div>
                               </div>
                                <div class="footer_contact_list">
                                   <div class="footer_contact_icon">
                                       <span>2</span>
                                   </div>
                                   <div class="footer_contact_text">
                                       <p>Call us for more info about our products.</p>
                                   </div>
                               </div>
                                <div class="footer_contact_list">
                                   <div class="footer_contact_icon">
                                       <span>3</span>
                                   </div>
                                   <div class="footer_contact_text">
                                       <p>Pay by creadit card.</p>
                                   </div>
                               </div>
                                <div class="footer_contact_list">
                                   <div class="footer_contact_icon">
                                       <span>4</span>
                                   </div>
                                   <div class="footer_contact_text">
                                       <p>We will send this product in 2 days.</p>
                                   </div>
                               </div>
                            </div>
                        </div>
                    </div> 
                    <div class="col-lg-3 col-md-4 col-sm-6">
                        <div class="footer_list">
                            <div class="footer_list_title">
                                <h3>contact us</h3>
                            </div>
                           <div class="footer_contact">
                               <div class="footer_contact_list">
                                   <div class="footer_contact_icon">
                                       <span><i class="fa fa-phone"></i></span>
                                   </div>
                                   <div class="footer_contact_text">
                                       <p>Call Us <a href="tel:+001666951">+001 666 951</a></p>
                                       <p>Fax <a href="tel:+001678987"> +001 678 987</a></p>
                                   </div>
                               </div>
                               <div class="footer_contact_list">
                                   <div class="footer_contact_icon">
                                       <span><i class="fa fa-mobile"></i></span>
                                   </div>
                                   <div class="footer_contact_text">
                                       <p><a href="tel:+771231234">+77 123 1234</a></p>
                                       <p><a href="tel:+42989876"> +42 98 9876</a></p>
                                   </div>
                               </div>
                               <div class="footer_contact_list">
                                   <div class="footer_contact_icon">
                                       <span><i class="fa fa-envelope"></i></span>
                                   </div>
                                   <div class="footer_contact_text">
                                       <p><a href="mailto:#">has@posthemes.com</a></p>
                                       <p><a href="mailto:#">has@posthemes.com</a></p>
                                   </div>
                               </div>
                            </div>
                        </div>
                    </div>  
                 </div>
            </div>
        </div>
        <div class="footer_social_newsletter">
            <div class="container">
                <div class="row">
                    <div class="col-lg-5 col-md-4">
                        <div class="footer_social">
                            <ul>
                                <li><a href="#"><i class="fa fa-facebook-square"></i></a></li>
                                <li><a href="#"><i class="fa fa-twitter"></i></a></li>
                                <li><a href="#"><i class="fa fa-google"></i></a></li>
                                <li><a href="#"><i class="fa fa-dribbble"></i></a></li>
                                <li><a href="#"><i class="fa fa-behance"></i></a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="col-lg-7 col-md-8">
                        <div class="newsletter_area">
                            <div class="newsletter_text">
                               <h2>Newsletter</h2>
                            </div>
                            <div class="subscribe_form">
                                <form id="mc-form" class="mc-form footer-newsletter" >
                                    <input id="mc-email" type="email" autocomplete="off" placeholder="Enter your e-mail" />
                                    <button id="mc-submit">Subscribe</button>
                                </form>
                                <!-- mailchimp-alerts Start -->
                                <div class="mailchimp-alerts text-centre">
                                    <div class="mailchimp-submitting"></div><!-- mailchimp-submitting end -->
                                    <div class="mailchimp-success"></div><!-- mailchimp-success end -->
                                    <div class="mailchimp-error"></div><!-- mailchimp-error end -->
                                </div><!-- mailchimp-alerts end -->
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="footer_middle">
            <div class="container">
                <div class="row">
                    <div class="col-lg-3 col-md-4 col-sm-6">
                        <div class="footer_list">
                            <div class="footer_list_title">
                                <h3>Categories</h3>
                            </div>
                            <div class="footer_list_menu">
                                <ul>
                                    <li><a href="#">T-Shirts & Top</a></li>
                                    <li><a href="#">Dress & Skirt</a></li>
                                    <li><a href="#">Denim</a></li>
                                    <li><a href="#">Menwear</a></li>
                                    <li><a href="#">Accessories</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-4 col-sm-6">
                        <div class="footer_list">
                            <div class="footer_list_title">
                                <h3>Information</h3>
                            </div>
                            <div class="footer_list_menu">
                                <ul>
                                    <li><a href="#">Specials</a></li>
                                    <li><a href="#">New products</a></li>
                                    <li><a href="#">Best sellers</a></li>
                                    <li><a href="#">Our stores</a></li>
                                    <li><a href="contact.html">Contact us</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-4 col-sm-6">
                        <div class="footer_list">
                            <div class="footer_list_title">
                                <h3>My account</h3>
                            </div>
                            <div class="footer_list_menu">
                                <ul>
                                    <li><a href="#">My orders</a></li>
                                    <li><a href="#">My credit slips</a></li>
                                    <li><a href="#">My addresses</a></li>
                                    <li><a href="#">My personal info</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-4 col-sm-6">
                        <div class="footer_list">
                            <div class="footer_list_title">
                                <h3>Extra</h3>
                            </div>
                            <div class="footer_list_menu">
                                <ul>
                                    <li><a href="#"> Specials </a></li>
                                    <li><a href="#"> New products </a></li>
                                    <li><a href="#">Best sellers</a></li>
                                    <li><a href="#">Our stores</a></li>
                                    <li><a href="contact.html"> Site Map </a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="footer_bottom"> 
            <div class="container"> 
                <div class="row align-items-center">
                    <div class="col-lg-6 col-md-7">
                        <div class="copyright_area">
                            <p>Copyright &copy; 2020.Company name All rights reserved.<a target="_blank" href="http://sc.chinaz.com/moban/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a></p>
                        </div>
                    </div> 
                    <div class="col-lg-6 col-md-5">
                       <div class="footer_paypal text-right">
                            <a href="#"><img src="assets/img/icon/payment.png" alt=""></a>	
                       </div>
                    </div>    
                </div>   
            </div>  
        </div>    
    </footer>
    <!--footer area end-->
   
    <!-- modal area start-->
    <div class="modal fade" id="modal_box" tabindex="-1" role="dialog"  aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                  <span aria-hidden="true"><i class="ion-android-close"></i></span>
                </button>
                <div class="modal_body">
                    <div class="container">
                        <div class="row">
                            <div class="col-lg-5 col-md-5 col-sm-12">
                                <div class="modal_tab">  
                                    <div class="tab-content product-details-large">
                                        <div class="tab-pane fade show active" id="tab1" role="tabpanel" >
                                            <div class="modal_tab_img">
                                                <a href="#"><img src="assets/img/product/productbig1.jpg" alt=""></a>    
                                            </div>
                                        </div>
                                        <div class="tab-pane fade" id="tab2" role="tabpanel">
                                            <div class="modal_tab_img">
                                                <a href="#"><img src="assets/img/product/productbig2.jpg" alt=""></a>    
                                            </div>
                                        </div>
                                        <div class="tab-pane fade" id="tab3" role="tabpanel">
                                            <div class="modal_tab_img">
                                                <a href="#"><img src="assets/img/product/productbig3.jpg" alt=""></a>    
                                            </div>
                                        </div>
                                        <div class="tab-pane fade" id="tab4" role="tabpanel">
                                            <div class="modal_tab_img">
                                                <a href="#"><img src="assets/img/product/productbig4.jpg" alt=""></a>    
                                            </div>
                                        </div>
                                    </div>
                                    <div class="modal_tab_button">    
                                        <ul class="nav product_navactive owl-carousel" role="tablist">
                                            <li >
                                                <a class="nav-link active" data-toggle="tab" href="#tab1" role="tab" aria-controls="tab1" aria-selected="false"><img src="assets/img/product/product3.jpg" alt=""></a>
                                            </li>
                                            <li>
                                                 <a class="nav-link" data-toggle="tab" href="#tab2" role="tab" aria-controls="tab2" aria-selected="false"><img src="assets/img/product/product8.jpg" alt=""></a>
                                            </li>
                                            <li>
                                               <a class="nav-link button_three" data-toggle="tab" href="#tab3" role="tab" aria-controls="tab3" aria-selected="false"><img src="assets/img/product/product1.jpg" alt=""></a>
                                            </li>
                                            <li>
                                               <a class="nav-link" data-toggle="tab" href="#tab4" role="tab" aria-controls="tab4" aria-selected="false"><img src="assets/img/product/product6.jpg" alt=""></a>
                                            </li>

                                        </ul>
                                    </div>    
                                </div>  
                            </div> 
                            <div class="col-lg-7 col-md-7 col-sm-12">
                                <div class="modal_right">
                                    <div class="modal_title mb-10">
                                        <h2>Donec Ac Tempus</h2> 
                                    </div>
                                    <div class="modal_price mb-10">
                                        <span class="new_price">$64.99</span>    
                                        <span class="old_price" >$78.99</span>    
                                    </div>
                                    <div class="modal_description mb-15">
                                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Mollitia iste laborum ad impedit pariatur esse optio tempora sint ullam autem deleniti nam in quos qui nemo ipsum numquam, reiciendis maiores quidem aperiam, rerum vel recusandae </p>    
                                    </div> 
                                    <div class="variants_selects">
                                        <div class="variants_size">
                                           <h2>size</h2>
                                           <select class="select_option">
                                               <option selected value="1">s</option>
                                               <option value="1">m</option>
                                               <option value="1">l</option>
                                               <option value="1">xl</option>
                                               <option value="1">xxl</option>
                                           </select>
                                        </div>
                                        <div class="variants_color">
                                           <h2>color</h2>
                                           <select class="select_option">
                                               <option selected value="1">purple</option>
                                               <option value="1">violet</option>
                                               <option value="1">black</option>
                                               <option value="1">pink</option>
                                               <option value="1">orange</option>
                                           </select>
                                        </div>
                                        <div class="modal_add_to_cart">
                                            <form action="#">
                                                <input min="1" max="100" step="2" value="1" type="number">
                                                <button type="submit">add to cart</button>
                                            </form>
                                        </div>   
                                    </div>
                                    <div class="modal_social">
                                        <h2>Share this product</h2>
                                        <ul>
                                            <li class="facebook"><a href="#"><i class="fa fa-facebook"></i></a></li>
                                            <li class="twitter"><a href="#"><i class="fa fa-twitter"></i></a></li>
                                            <li class="pinterest"><a href="#"><i class="fa fa-pinterest"></i></a></li>
                                            <li class="google-plus"><a href="#"><i class="fa fa-google-plus"></i></a></li>
                                            <li class="linkedin"><a href="#"><i class="fa fa-linkedin"></i></a></li>
                                        </ul>    
                                    </div>      
                                </div>    
                            </div>    
                        </div>     
                    </div>
                </div>    
            </div>
        </div>
    </div>
    <!-- modal area end-->


 
<!-- JS
============================================ -->
<!--jquery min js-->
<script src="assets/js/vendor/jquery-3.5.0.min.js"></script>
<!--popper min js-->
<script src="assets/js/popper.js"></script>
<!--bootstrap min js-->
<script src="assets/js/bootstrap.min.js"></script>
<!--owl carousel min js-->
<script src="assets/js/owl.carousel.min.js"></script>
<!--slick min js-->
<script src="assets/js/slick.min.js"></script>
<!--magnific popup min js-->
<script src="assets/js/jquery.magnific-popup.min.js"></script>
<!--jquery countdown min js-->
<script src="assets/js/jquery.countdown.js"></script>
<!--jquery ui min js-->
<script src="assets/js/jquery.ui.js"></script>
<!--jquery elevatezoom min js-->
<script src="assets/js/jquery.elevatezoom.js"></script>
<!--isotope packaged min js-->
<script src="assets/js/isotope.pkgd.min.js"></script>
<!-- Plugins JS -->
<script src="assets/js/plugins.js"></script>

<!-- Main JS -->
<script src="assets/js/main.js"></script>


</body>

</html>